import React,{useState} from "react";


export default function App(){
  /* //useState得到的是一个数组  数组的第一个元素是  数据 第二个元素是改变数据的方法
    const obj=useState("zjb")
    console.log(obj)
 */
 const [tex ,setTex]=useState("")
 const[list,setList]=useState([])

 const handleChange=(e)=>{

   setTex(e.target.value)
 

 }
 const handleClick=(e)=>{
     console.log([...list,tex])
     setList([...list,tex])
     setTex("")
     
 }
 const handledel=(index)=>{
    const newList=[...list]
    newList.splice(index,1)
    setList(newList)
 
}
    return (
        <div>
            <input  onChange={handleChange}  value={tex} />
            <button onClick={handleClick}>添加评论</button><br/>
           评论内容：
           <ul>
              { list.map((item,index)=>
              <li key={item}>{item}  <button onClick={()=>handledel(index)}  >del</button></li>
            
               )}
           </ul>
           {!list.length&&<div>暂无评论</div>}
        </div>
    )
}